﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WxPay.aspx.cs" Inherits="WeChat.JsSDK.WxPayTest.WxPay" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
    <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/> 
    <script src="../../bootstrap-3.3.5-dist/js/jquery-1.11.3.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>  
    <title>微信支付样例-JSAPI支付</title>


<script type="text/javascript"> 
// 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。
 document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {              
  $('#submit').click(function (e) {
                WeixinJSBridge.invoke(
                'getBrandWCPayRequest', 
                <%=wxJsApiParam%>,//josn串
                function (res) {
                    WeixinJSBridge.log(res.err_msg);
                    alert(res.err_code + res.err_desc + res.err_msg);
                    if (res.err_msg == "get_brand_wcpay_request:ok") {
                        //alert("您已成功支付订单！");
                        window.location.replace("http://www.xjchtz.com/JsSDK/WxPay/PayResult.aspx");
                    }
                    else if (res.err_msg == "get_brand_wcpay_request:cancel") {
                        //alert("您取消本次支付!");
                        //window.location.replace("http://www.xjchtz.com/JsSDK/WxPay/PayResult.aspx?fail=true");
                    }
                    else {
                        //alert("支付失败！错误信息：" + res.err_msg);
                        window.location.replace("http://www.xjchtz.com/JsSDK/WxPay/PayResult.aspx?fail=true");
                    }
                    // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
                    //因此微信团队建议，当收到ok返回时，向商户后台询问是否收到交易成功的通知，若收到通知，前端展示交易成功的界面；若此时未收到通知，商户后台主动调用查询订单接口，查询订单的当前状态，并反馈给前端展示相应的界面。
                });
            });
            WeixinJSBridge.log('yo~ ready.');
        }, 
        false)                       
</script>
</head>
<body>
    <div class="bodywrap">
    <div class="top">
       <p><%=goodsName%></p>
       <div class="topc">
          <p>￥<%=total_feeShow%></p>
       </div>
    </div>
    <div class="con">
       <div class="conbox">
          <p>收款方<span><%=CompanyName%></span></p>
          <p>商品<span><%=goodsName%></span></p>
       </div>    
    </div>
    <div class="tj">
        <input id="submit"  type="button" value="立即支付">
    </div>
</div>
</body>

<style type="text/css">
* {
	margin: 0;
	padding: 0;
	list-style: none;
	text-decoration: none;
}
body {
	background: #f0eff4;
}
.bodywrap {
	width: 100%;
	background: #f0eff4;
}
.top{padding-top:13px; text-align:center; font-weight:500; border-bottom:2px solid #f5f5f5; }
.topc{font-size:26px; border-bottom:1px solid #f1f1f1; line-height:30px; padding-bottom:16px;}
.con{border-top:2px solid #edeeed; background:#fff;}
.conbox{border-top:1px #f5f5f5 solid;border-bottom:1px #f5f5f5 solid; padding:15px;}
.conbox p{font-size:14px; color:#909192}
.conbox p span{color:#000; float:right; font-weight:400}
.conbox p:first-child{margin-bottom:8px;}
.tj {
	margin: 20px 10px 30px;
}
.tj input {
	background-color: #04be02;
	background-image: none;
	border: 1px solid #04be02;
	height: 40px;
	border-radius: 5px;
	box-shadow: none;
	box-sizing: border-box;
	font-size: 16px;
	text-align: center;
	width: 100%;
	color: #fff;
	cursor: pointer;
}
</style>
</html>